*{
	margin:0;
	padding:0;
}
body{
	background:#F5F5F5;
	font-size:12px;
}
.cf:after{
	conten:"";
	display:block;
	clear:both;
}
.box{
	width:1226px;
	height:620px;
	margin:30px auto 0;
	/*border:1px solid red;*/
	
	
}
/*left*/
.boxleft{
	background:rgb(223,220,201);
/*	border:1px solid green;*/
	width:240px;
	height:100%;
	position:relative;
	transition:all .2s;
	float:left;
}
.boxleft:hover{
	transform:translate(-3px);
    box-shadow:10px 2px 20px rgba(0,0,0,.1);   
}
.item-img{
	width:240px;
	margin:0 auto;	
}
/*图片设置宽高，父元素需要有高度和宽度*/
.item-img>a{
	display: block;
	width: 100%;
	height: 423px;
}
.item-img>a>img{
	width: 100%;
	height: 100%;
}
.name{
	padding-top:70px;
	text-align:center;
	font-size:20px;
}
.name a{
	color:#333;
	font-size:28px;
	text-decoration: none;
}
.new{
	color:#999;
	text-align:center;
	line-height:24px;
}

.price{
	text-align:center;
	color:green;
	font-size:18px;
	padding-top:20px;
}
.price span{
	text-decoration:line-through;
	color:#999;
}
.item:hover{
	transform:translate(-3px);
    box-shadow:10px 2px 20px rgba(0,0,0,.1);   
}


/*right*/
.item1{
	width:234px;
	height:300px;
	margin:0 0 0 10px;
	background:#fff;
	position:relative;
	transition:all .2s;
/*	border:1px solid green;*/
	float:left;
	
}
.item-img1{
	width:200px;
	margin:0 auto;
	padding-top:20px;
}
.item-img1>a>img{
	width:200px;
	height:180px;
}
.name1{
	text-align:center;
	font-size:14px;
}
.name1 a{
	color:#333;
	text-decoration: none;
}
.desc1{
	color:#999;
	text-align:center;
	line-height:24px;
}
.price1{
	text-align:center;
	color:#f60;
	font-size:14px;
	padding-top:10px;
}
.price1 span{
	text-decoration: line-through;
	color:#999;
}
.zhekou1{
	width:64px;
	height:20px;
	line-height:20px;
	text-align:center;
	background:#E53935;
	position:absolute;
	left:50%;
	top:0;
	color:#fff;
	transform:translateX(-50%);
}
.item1:hover{
	transform:translateY(-3px);
	box-shadow:0 0 20px rgba(0,0,0,.1);
}
.info1{
	height:0px;
	position:absolute;
	left:0;
	bottom:0;
	background:#f60;
	padding-top:10px;
	opacity:0;
	transition:all .2s;
}
.info1 p{
	padding:0 25px;
}
.info1 p:first-child{
	color:#fff;
}
.info1 p:last-child{
	padding-top:5px;
	color:rgba(255,255,255,.6)
}
.item1:hover .info1{
	height:68px;
	opacity:1;
}
/*right2*/
.item2{
	width:234px;
	height:300px;
	margin:0 0 0 10px;
	background:#fff;
	position:relative;
	transition:all .2s;
	/*border:1px solid green;*/
	float:left;
	
}

.item1:hover{
	transform:translateY(-3px);
	box-shadow:0 0 20px rgba(0,0,0,.1);
}
.info1{
	height:0px;
	position:absolute;
	left:0;
	bottom:0;
	background:#f60;
	padding-top:10px;
	opacity:0;
	transition:all .2s;
}
.info2 p{
	padding:0 25px;
}
.info2 p:first-child{
	color:#fff;
}
.info2 p:last-child{
	padding-top:5px;
	color:rgba(255,255,255,.6)
}
.item2:hover .info1{
	height:68px;
	opacity:1;
}

/*第二行*/

.item3{
	
	width:234px;
	height:300px;
	margin:10px 0 0 10px;
	background:#fff;
	position:relative;
	transition:all .2s;
	/*border:1px solid green;*/
	float:left;
	
}
.item-img3{
	width:200px;
	margin:0 auto;
	padding-top:20px;
}
.item-img3>a>img{
	width:200px;
	height:180px;
}
.name3{
	text-align:center;
	font-size:14px;
}
.name3 a{
	color:#333;
	text-decoration: none;
}
.desc3{
	color:#999;
	text-align:center;
	line-height:24px;
}
.price3{
	text-align:center;
	color:#f60;
	font-size:14px;
	padding-top:10px;
}

.zhekou3{
	
	width:80px;
	height:20px;
	line-height:20px;
	text-align:center;
	background:rgb(255,172,19);
	position:absolute;
	left:50%;
	top:0;
	color:#fff;
	transform:translateX(-50%);
}
.item3:hover{
	transform:translateY(-3px);
	box-shadow:0 0 20px rgba(0,0,0,.1);
}
.info3{
	height:0px;
	position:absolute;
	left:0;
	bottom:0;
	background:#f60;
	padding-top:10px;
	opacity:0;
	transition:all .2s;
}
.info3 p{
	padding:0 25px;
}
.info3 p:first-child{
	color:#fff;
}
.info3 p:last-child{
	padding-top:5px;
	color:rgba(255,255,255,.6)
}
.item3:hover .info3{
	height:68px;
	opacity:1;
}

/*第六个*/
.item4{
	
	width:234px;
	height:300px;
	margin:10px 0 0 10px;
	background:#fff;
	position:relative;
	transition:all .2s;
	/*border:1px solid green;*/
	float:left;
	
}
.item-img4{
	width:200px;
	margin:0 auto;
	padding-top:20px;
}
.item-img4>a>img{
	width:200px;
	height:180px;
}
.name4{
	text-align:center;
	font-size:14px;
}
.name4 a{
	color:#333;
	text-decoration: none;
}
.desc4{
	color:#999;
	text-align:center;
	line-height:24px;
}
.price4{
	text-align:center;
	color:#f60;
	font-size:14px;
	padding-top:10px;
}

/*.zhekou4{
	
	width:80px;
	height:20px;
	line-height:20px;
	text-align:center;
	background:rgb(255,172,19);
	position:absolute;
	left:50%;
	top:0;
	color:#fff;
	transform:translateX(-50%);
}*/
.item4:hover{
	transform:translateY(-3px);
	box-shadow:0 0 20px rgba(0,0,0,.1);
}
.info4{
	height:0px;
	position:absolute;
	left:0;
	bottom:0;
	background:#f60;
	padding-top:10px;
	opacity:0;
	transition:all .2s;
}
.info4 p{
	padding:0 25px;
}
.info4 p:first-child{
	color:#fff;
}
.info4 p:last-child{
	padding-top:5px;
	color:rgba(255,255,255,.6)
}
.item4:hover .info4{
	height:68px;
	opacity:1;
}


/*第七个*/
.item7{
	
	width:234px;
	height:300px;
	margin:10px 0 0 10px;
	background:#fff;
	position:relative;
	transition:all .2s;
	/*border:1px solid green;*/
	float:left;
	
}
.item-img7{
	width:200px;
	margin:0 auto;
	padding-top:20px;
}
.item-img7>a>img{
	width:200px;
	height:180px;
}
.name7{
	text-align:center;
	font-size:14px;
}
.name7 a{
	color:#333;
	text-decoration: none;
}
.desc7{
	color:#999;
	text-align:center;
	line-height:24px;
}
.price7{
	text-align:center;
	color:#f60;
	font-size:14px;
	padding-top:10px;
}

.zhekou7{
	
	width:80px;
	height:20px;
	line-height:20px;
	text-align:center;
	background:rgb(131,196,78);
	position:absolute;
	left:50%;
	top:0;
	color:#fff;
	transform:translateX(-50%);
}
.item7:hover{
	transform:translateY(-3px);
	box-shadow:0 0 20px rgba(0,0,0,.1);
}
.info7{
	height:0px;
	position:absolute;
	left:0;
	bottom:0;
	background:#f60;
	padding-top:10px;
	opacity:0;
	transition:all .2s;
}
.info7 p{
	padding:0 25px;
}
.info7 p:first-child{
	color:#fff;
}
.info7 p:last-child{
	padding-top:5px;
	color:rgba(255,255,255,.6)
}
.item7:hover .info7{
	height:68px;
	opacity:1;
}

/*第八个*/
.item8{
	
	width:234px;
	height:300px;
	margin:10px 0 0 10px;
	background:#fff;
	position:relative;
	transition:all .2s;
	/*border:1px solid red;*/
	float:left;
	
}
/*8-1*/
.xiaobai{
	width:234px;
	height:145px;
	margin:0 auto;
	/*border:1px solid blue;*/
}

.item-img8{
	float:left;
	width:100px;
	height:145px;
	padding-top:20px;
	padding-left:10px;
}
.item-img8>a>img{
	width:120px;
	height:110px;
}
.box8{
	width:100px;
	height:145px;
	float:left;
}
.name8{
	
	padding-top:50px;
	text-align:center;
	font-size:14px;
}
.name8 a{
	color:#333;
	text-decoration: none;
}

.price8{
	text-align:center;
	color:#f60;
	font-size:14px;
	padding-top:10px;
}

.xiaobai:hover{
	transform:translateY(-3px);
	box-shadow:0 0 20px rgba(0,0,0,.1);
}

/*8-2*/
.xiaoliu{
	
	width:234px;
	height:145px;
	margin:10 auto 0;
	/*border:1px solid blue;*/
}

.item-img9{
	float:left;
	width:100px;
	height:145px;
	padding-top:20px;
	padding-left:10px;
}
.item-img9>a>img{
	width:120px;
	height:110px;
}
.box9{
	width:100px;
	height:145px;
	float:left;
}
.name9{
	
	padding-top:50px;
	text-align:center;
	font-size:14px;
}
.name9 a{
	color:#333;
	text-decoration: none;
}

.xiaoliu:hover{
	transform:translateY(-3px);
	box-shadow:0 0 20px rgba(0,0,0,.1);
}

.desc9{
	color:#999;
	text-align:center;
	line-height:24px;
}